import styles from './index.less'
import { useRequest } from 'ahooks';
import LeftTop from '@/pages/main/components/LeftTop';
import CenterTop from '@/pages/main/components/CenterTop';
import RightTop from '@/pages/main/components/RightTop';
import LeftBottom from '@/pages/main/components/LeftBottom';
import CenterLeftBottom from '@/pages/main/components/CenterLeftBottom';
import CenterRightBottom from '@/pages/main/components/CenterRightBottom';
import RightBottom from '@/pages/main/components/RightBottom';
import data from './data.json';

export default props => {
  if (process.env.NODE_ENV === 'development') {
    let { data = {} } = useRequest('/api/data');
  }

  return <div className={styles.wrapper}>
    <Header/>
    <LeftTop data={data.warning}/>
    <CenterTop/>
    <RightTop data={data.rightTop}/>
    <LeftBottom data={data.leftBottom}/>
    <CenterLeftBottom data={data.centerLeftBottom}/>
    <CenterRightBottom data={data.centerRightBottom}/>
    <RightBottom data={data.rightBottom}/>
  </div>
}

const Header = props => {
  return <div className={styles.header}>
    <div className={styles.headerLeft}/>
    <div className={styles.headerCenter}>
      酒泉烟草智慧物流综合管控平台
    </div>
    <div className={styles.headerRight}/>
  </div>
}
